let scene, camera, renderer
let winWidth = window.innerWidth,
  winHeight = window.innerHeight
let txtMesh
let round = 0
let mineDom
let mineNum = 50
let ux = (uy = uz = 10)
let theme = {
  id: 1,
  color_bg: 0xe0e0e0,
  color_bg1: '#E0E0E0',
  color_md: 0xa0a0a0,
  color_1: '#AAA',
  color_2: '#CCC',
  music_bgm: undefined,
  music_game: undefined
}
initData()
init()
render()
function init() {
  scene = new THREE.Scene()
  camera = new THREE.PerspectiveCamera(45, winWidth / winHeight, 1, 2000)
  renderer = new THREE.WebGLRenderer({ antialias: true })

  let light = new THREE.PointLight(0xaaaaaa)
  light.position.set(0, 0, 1000)
  scene.add(light)

  let ambient = new THREE.AmbientLight(0x444444)
  scene.add(ambient)

  camera.position.set(0, 0, 1000)
  camera.lookAt(scene.position)
  scene.add(camera)

  title()

  renderer.setSize(winWidth, winHeight)
  renderer.setClearColor(theme.color_bg, 1)
  document.body.appendChild(renderer.domElement)
}
function initData() {
  let init = localStorage.sweeperInit
  if (init) {
    init = JSON.parse(init)
    ux = init.ux
    uy = init.uy
    uz = init.uz
    mineNum = init.mineNum
  }
  document.getElementsByName('ux')[0].value = ux
  document.getElementsByName('uy')[0].value = uy
  document.getElementsByName('uz')[0].value = uz
  document.getElementsByName('mine')[0].value = mineNum

  let data = localStorage.gameTheme
  if (!data) {
    data = {
      color: {
        name: '蓝灰色',
        id: 1,
        show: '#567',
        color_bg: '0xa0b0c0',
        color_bg1: '#A0B0C0',
        color_md: '0x778899',
        color_1: '#89A',
        color_2: '#ABC'
      },
      font: {
        id: 1,
        name: '夏日风格字体',
        value: 'xiari'
      }
      // game_music: {
      //   id: 1,
      //   name: '作者配音',
      //   introduce: '/music/author/introduce.mp3',
      //   dig: '/music/author/dig.mp3',
      //   flag: '/music/author/flag.mp3',
      //   over: '/music/author/over.mp3',
      //   win: '/music/author/win.mp3',
      //   hidden: '/music/author/hidden.mp3'
      // }
    }
    console.log(data)
    localStorage.gameTheme = JSON.stringify(data)
  }
  if (data) {
    if (!data.color) {
      data = JSON.parse(data)
    }
    if (data.color)
      theme = {
        color_bg: parseInt(data.color.color_bg, 16),
        color_bg1: data.color.color_bg1,
        color_md: parseInt(data.color.color_md, 16),
        color_1: data.color.color_1,
        color_2: data.color.color_2
      }
    if (data.font) {
      document.body.classList.add('font-' + data.font.value)
    }
    theme.music_bgm = data.bgm ? data.bgm : undefined
    theme.music_game = data.game_music ? data.game_music : undefined
  }
  document.getElementById('box').style.background = theme.color_bg1
}
function title() {
  let loader = new THREE.FontLoader()

  loader.load('./fonts/helvetiker_regular.typeface.json', function (font) {
    let params = {
      font: font,
      size: 60,
      height: 20,
      curveSegments: 4,
      bevelThickness: 2,
      bevelSize: 1.5,
      bevelEnabled: true
    }
    let geometry
    let materials = [
      new THREE.MeshPhongMaterial({ color: theme.color_1 }), // front
      new THREE.MeshPhongMaterial({ color: theme.color_1 }) // side
    ]
    if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
      geometry = new THREE.TextGeometry('Sweeper', params)
      geometry.center()
      txtMesh = new THREE.Mesh(geometry, materials)
      txtMesh.position.y = 120
    } else {
      geometry = new THREE.TextGeometry('MineSweeper!', params)
      geometry.center()
      txtMesh = new THREE.Mesh(geometry, materials)
      txtMesh.position.y = 70
    }
    scene.add(txtMesh)
  })
}
function render() {
  requestAnimationFrame(render)
  round <= Math.PI * 200 ? (round += 2) : (round = 0)
  if (txtMesh) txtMesh.rotation.y = Math.sin(round / 100) / 3

  renderer.render(scene, camera)
}
function limitMineNum() {
  ux = document.getElementsByName('ux')[0].value
  uy = document.getElementsByName('uy')[0].value
  uz = document.getElementsByName('uz')[0].value
  if (ux == '' || uy == '' || uz == '') {
    alert('请先确认场景大小')
    document.getElementsByName('mine')[0].value = '0'
    return
  }
  mineDom = document.getElementsByName('mine')[0]
  if ((ux * uy * uz) / 2 < mineDom.value) {
    mineDom.value = (ux * uy * uz) / 2
  }
  // console.log(mineNum);
}
function handleBegin() {
  if (document.getElementsByName('mine')[0].value == '') {
    alert('雷数不能为空')
    return
  }
  let init = {
    ux: document.getElementsByName('ux')[0].value,
    uy: document.getElementsByName('uy')[0].value,
    uz: document.getElementsByName('uz')[0].value,
    mineNum: document.getElementsByName('mine')[0].value
  }
  localStorage.sweeperInit = JSON.stringify(init)
  window.location.href = './sweeper.html'
  // console.log(localStorage.sweeperInit);
}
